<template>
	<view class="box">
		
		<view class="one">
			<text style="text-align: center; display: block;">主页</text>
			<view class="two"></view>
			<view style="margin-top: 80rpx; font-size: 32rpx; color: #f4f4f4; letter-spacing: 1rpx;">艾昆汽修厂,欢迎您</view>
		</view>
		
		<view class="three">
			<view class="three_one" @click="saoma">
				<text>扫码核销</text>
			</view>
			<view class="three_two" @click="shuru">
				<text>输入核销码</text>
			</view>
		</view>
		
		<view class="four">
			<view class="four_box">
				<view class="four_one">
					<image src="../../../static/统计.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 25rpx;"></image>
					<text>经营统计</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #ff7700;">
					<image src="../../../static/核销记录 (1).png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 26rpx;"></image>
					<text>核销记录</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #0a60ff;">
					<image src="../../../static/123收支明细.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 26rpx;"></image>
					<text>收支明细</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #ffaa00;">
					<image src="../../../static/订单管理.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 25rpx;"></image>
					<view class="four_two" v-if="true">
						22
					</view>
					<text>订单管理</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #393bdf;">
					<image src="../../../static/卡券.png" style="width: 50rpx; height: 40rpx; margin-top: 30rpx; margin-left: 25rpx;"></image>
					<text style="margin-top: 45rpx;">卡卷管理</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #00e9a7;">
					<image src="../../../static/维修.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 25rpx;"></image>
					<view class="four_two" v-if="true">
						22
					</view>
					<text>维修任务</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #ff3737;">
					<image src="../../../static/评价管理.png" style="width: 40rpx; height: 60rpx; margin-top: 20rpx; margin-left: 30rpx;"></image>
					<text style="margin-top: 35rpx;">评价管理</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #2cbacf;">
					<image src="../../../static/资料库.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 30rpx;"></image>
					<text>商户资料</text>
				</view>
			</view>
			
			<view class="four_box">
				<view class="four_one" style="background-color: #eb6e00;">
					<image src="../../../static/活动.png" style="width: 50rpx; height: 50rpx; margin-top: 25rpx; margin-left: 25rpx;"></image>
					<text>活动发布</text>
				</view>
			</view>
			
		</view>
		
		<view class="five">
			<view class="five_one">
				<text>最新通知</text>
				<!-- 查询 five_two 表的总数, 替换问号, 若无数据,则不显示该行-->
				<text v-if="true">今日需上门取车任务共??单 ❯</text>
			</view>
			
			<view class="five_two">
				放置查询出来的数据
			</view>
		</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			saoma(){
				uni.redirectTo({
					url: '/pages/lcl-HeXiaoCaoZuo/saoma1/saoma1'
				})
			},
			shuru(){
				uni.redirectTo({
					url: '/pages/lcl-HeXiaoCaoZuo/shuru1/shuru1'
				})
			}
		}
	}
</script>

<style scoped>
.box{
	background-color: #fafafa;
	padding-bottom: 200rpx;
	/* z-index: -1; */
}

.one{
	height: 400rpx;
	width: 100%;
	background-color: #297EFA;
	color: white;
	font-size: 40rpx;
	letter-spacing: 5rpx;
	box-sizing: border-box;
	padding-top: 50rpx;
	/* z-index: 10; */
}

.two{
	width: 150rpx;
	height: 150rpx;
	background-color: #5397FB;
	border-radius: 50%;
	box-sizing: border-box;
	padding: 5rpx;
	background-image: url('../../../static/图层 3.png');
	background-position: center center;
	background-repeat: no-repeat;
	margin-left: 60rpx;
	margin-top: 20rpx;
	float: left;
	margin-right: 20rpx;
}

.three{
	width: 710rpx;
	height: 260rpx;
	background-color: white;
	/* background-color: #edffa9; */
	box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.1);
	margin: 0 auto;
	margin-top: -100rpx;
	border-radius: 15rpx;
	box-sizing: border-box;
	padding: 40rpx 5rpx;
}
.three_one, .three_two{
	height: 180rpx;
	width: 350rpx;
	background-repeat: no-repeat;
	background-position: top;
	text-align: center;
	float: left;
}
.three_one{
	/* background-color: aquamarine; */
	background-image: url('../../../static/扫码.png');
	/* background-repeat: no-repeat;
	background-position: top;
	text-align: center; */
	border-right: 1rpx solid #e7e7e7;
}
.three_one text, .three_two text{
	line-height: 260rpx;
	font-size: 30rpx;
}
.three_two{
	/* background-color: beige; */
	background-image: url('../../../static/输入2.png');
}

.four{
	width: 710rpx;
	height: 600rpx;
	background-color: white;
	box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.1);
	border-radius: 15rpx;
	box-sizing: border-box;
	margin-top: 20rpx;
	margin-left: 20rpx;
	padding: 40rpx;
	
}
.four view:nth-child(4n){
	margin-right: 0;
}
.four view:nth-child(9){
	margin-bottom: 0;
}
.four_box{
	width: 100rpx;
	height: 140rpx;
	/* background-color: aquamarine; */
	float: left;
	margin-right: 70rpx;
	margin-bottom: 50rpx;
}
.four_box text{
	z-index: 5;
	display: block;
	margin-top: 40rpx;
	font-size: 22rpx;
	margin-left: 6rpx;
}
.four_one{
	width: 100rpx;
	height: 100rpx;
	background-color: #00a6ff;
	border-radius: 50%;
	/* background-image: url('../../../static/统计.png') !important; */
	background-position: center center;
	background-repeat: no-repeat;
	background-image: linear-gradient(to bottom right, white, transparent);
}
.four_two{
	width: 30rpx;
	height: 30rpx;
	background-color: orangered;
	border-radius: 50%;
	position: absolute;
	margin-left: 80rpx;
	margin-top: 15rpx;
	font-size: 18rpx;
	color: white;
	line-height: 30rpx;
	text-align: center;
}

.five{
	width: 710rpx;
	height: 600rpx;
	background-color: white;
	box-shadow: 0 5rpx 5rpx rgba(0, 0, 0, 0.1);
	margin-top: 20rpx;
	margin-left: 20rpx;
	border-radius: 15rpx;
	box-sizing: border-box;
	padding: 20rpx;
}
.five_one{
	height: 80rpx;
	/* background-color: #9aeba1; */
	background-image: url('../../../static/消息-信息.png');
	background-repeat: no-repeat;
	background-position: left;
	border-bottom: 1rpx solid #eaeaea;
	margin-bottom: 20rpx;
}
.five_one text:nth-child(1){
	line-height: 80rpx;
	margin-left: 50rpx;
	font-weight: 550;
}
.five_one text:nth-child(2){
	float: right;
	color: orange;
	font-size: 26rpx;
	font-weight: 550;
	margin-top: 20rpx;
}
</style>
